<template>
  <BwComList
    ref="curtomcom"
    receivClass="bw-curtom-com-list"
    :com-list="curComList"
  />
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import { useComDesignStoreWithOut } from '@/store'

import { BwComTypeEnum } from '@bitwit/base-com-render'

import BwComList from '../group/index.vue'
import type { BwComGroupModel } from '../model'

const curtomcom = ref()
const curComList = ref<Array<BwComGroupModel>>([])

const designStore = useComDesignStoreWithOut()
onMounted(() => {
  const comList = designStore.curCustomComList
  const list: Array<BwComGroupModel> = []
  if (Array.isArray(comList)) {
    comList.forEach((n) => {
      const group = n.group
      const item = list.find((n) => n.group === group)
      if (item) {
        item.coms = item.coms ?? []
        item.coms.push({
          icon: '',
          isDrag: true,
          comKey: n.code ?? '',
          comName: n.name ?? '',
          appId: n.appId ?? null,
          appCode: n.appCode ?? null,
          type: BwComTypeEnum.custom,
        })
      } else {
        list.push({
          icon: '',
          key: BwComTypeEnum.custom ?? '',
          group: group ?? '',
          coms: [
            {
              icon: '',
              isDrag: true,
              comKey: n.code ?? '',
              comName: n.name ?? '',
              appId: n.appId ?? null,
              appCode: n.appCode ?? null,
              type: BwComTypeEnum.custom,
            },
          ],
        })
      }
    })
  }
  curComList.value = list
})
</script>

<style lang="less" scoped></style>
